
$(function(){
    //在加载页面时，只显示所有课程的container
    choose(1);
    //加载页面时，首先显示还在继续中的课程
    myselfChoose(1);

    //购买课程，传递课程编号cid以及课时量num，价格price，购买者uid
    //并异步提交,前端提示数据
    $("#buyCourses").click(function(){
        $.post("/addToMyCourses",{"cid":$("#courseId").val(),
            "uid":$("#userId").val(),
           "classNum":$("#courseNum").val()},function () {
            $("#info").css("display","block");
            $("#msg").html("<p>&nbsp;</p><p>&nbsp;</p><p style='font-size: 42px;margin-top:-30px;'>购买成功</p>");
            window.setTimeout(function(){
                $("#info").css("display","none");
            },2500);
        });
    });

});

/**
 * 课程商城相关JS
 */
//实现功能：感觉点击显示相关信息。
function choose(i){
    if(i==1){
        //改变导航栏样式
        $("#oneLi").addClass("active");
        $("#twoLi").removeClass("active");
        $("#threeLi").removeClass("active");
        $("#fourLi").removeClass("active");
        $("#fiveLi").removeClass("active");
        //改变所展示的课程信息的显示情况
        $("#oneContainer").css("display","block");
        $("#twoContainer").css("display","none");
        $("#threeContainer").css("display","none");
        $("#fourContainer").css("display","none");
        $("#fiveContainer").css("display","none");

    }
    if(i==2){
        $("#oneLi").removeClass("active");
        $("#twoLi").addClass("active");
        $("#threeLi").removeClass("active");
        $("#fourLi").removeClass("active");
        $("#fiveLi").removeClass("active");
        $("#oneContainer").css("display","none");
        $("#twoContainer").css("display","block");
        $("#threeContainer").css("display","none");
        $("#fourContainer").css("display","none");
        $("#fiveContainer").css("display","none");
    }
    if(i==3){
        $("#oneLi").removeClass("active");
        $("#twoLi").removeClass("active");
        $("#threeLi").addClass("active");
        $("#fourLi").removeClass("active");
        $("#fiveLi").removeClass("active");
        $("#oneContainer").css("display","none");
        $("#twoContainer").css("display","none");
        $("#threeContainer").css("display","block");
        $("#fourContainer").css("display","none");
        $("#fiveContainer").css("display","none");
    }
    if(i==4){
        $("#oneLi").removeClass("active");
        $("#twoLi").removeClass("active");
        $("#threeLi").removeClass("active");
        $("#fourLi").addClass("active");
        $("#fiveLi").removeClass("active");
        $("#oneContainer").css("display","none");
        $("#twoContainer").css("display","none");
        $("#threeContainer").css("display","none");
        $("#fourContainer").css("display","block");
        $("#fiveContainer").css("display","none");
    }
    if(i==5){
        $("#oneLi").removeClass("active");
        $("#twoLi").removeClass("active");
        $("#threeLi").removeClass("active");
        $("#fourLi").removeClass("active");
        $("#fiveLi").addClass("active");
        $("#oneContainer").css("display","none");
        $("#twoContainer").css("display","none");
        $("#threeContainer").css("display","none");
        $("#fourContainer").css("display","none");
        $("#fiveContainer").css("display","block");
    }
}

function add(){
    var num = parseInt($("#courseNum").val());
    var price = parseInt($("#coursePrice").val());
    $("#courseNum").val(num+1);
    $("#totalCoursePrice").val((num+1)*price);
}

function sub(){
    var num = parseInt($("#courseNum").val());
    var price = parseInt($("#coursePrice").val());
    if(num<=1){return false;}
    $("#courseNum").val(num-1);
    $("#totalCoursePrice").val((num-1)*price);
}

//实时监听课时数的变化，实现对总数值的改变

$("#courseNum").bind('input propertychange',function(){
    var price = parseInt($("#coursePrice").val());
    if(isNaN($(this).val())==false){
        $("#totalCoursePrice").val(parseInt($(this).val())*price);
    }else{
        $(this).val(1);
        $("#totalCoursePrice").val(price);
    }

});

//通过动态传参cid ,通过ajax获取课程信息
function getCourseInfo(cid){
    $.post("/getCourseByCid",{"cid":cid},function (data) {
        $("#courseId").val(data.cid);
        $("#samplePicture").attr("src","images/"+data.sample);
        $("#totalCoursePrice").val(data.price);
        $("#coursePrice").val(data.price);
        $("#courseName").text(data.cname);
        $("#courseTeacher").text(data.teacher);
        $("#courseVenue").text(data.venue)
        $("#courseHot").text(data.searchRanking);
        $("#courseLike").text(data.orderRanking);
        $("#courseNum").val(1);
    });
}

/**
 * 我的课程相关js
 */

//实现功能：根据点击显示相关信息。
function myselfChoose(i){
    if(i==1){
        //改变导航栏样式
        $("#oneLi").addClass("active");
        $("#twoLi").removeClass("active");
        //改变所展示的课程信息的显示情况
        $("#oneContainer").css("display","block");
        $("#twoContainer").css("display","none");
        //异步提交获取正在进行中的所有课程的对象数组,并json解析
        $.post("/getMyCourses",{"uid":$("#userId").val()},function (myCourses) {
            var String = "";
            for(var i=0;i<myCourses.length;i++){
                if(myCourses[i].state==0) {
                    String = String +
                        "<div class='col-sm-4 col-xs-12'>" +
                        "<a href='javascript:;' onclick='getMyCourseInfo(" + myCourses[i].id + ")' data-toggle='modal' data-target='#myModal'>" +
                        "<div class='feature-box'>" +
                        "<figure>" +
                        "<img src='images/" + myCourses[i].course.sample + "' width='350px' height='239.167px'>" +
                        "<div class='time-box'>" +
                        "<span class='date'><span>购买课时：" + myCourses[i].classNum + "</span></span>" +
                        "<span class='time'><span>剩余课时：" + myCourses[i].numLast + "</span></span>" +
                        "</div>" +
                        "</figure>" +
                        "</div>" +
                        "</a>" +
                        "</div>";
                }
            }
            console.log(String);
            $("#myCourseDiv").html(String);
        });
    }
    if(i==2){
        $("#oneLi").removeClass("active");
        $("#twoLi").addClass("active");
        $("#oneContainer").css("display","none");
        $("#twoContainer").css("display","block");
        $.post("/getMyCourses",{"uid":$("#userId").val()},function (myCourses) {
            var String = "";
            for(var i=0;i<myCourses.length;i++){
                if(myCourses[i].state==2) {
                    String = String +
                        "<div class='col-sm-4 col-xs-12'>" +
                        "<a href='javascript:;' onclick='getMyCourseInfo(" + myCourses[i].id + ")' data-toggle='modal' data-target='#myModal'>" +
                        "<div class='feature-box'>" +
                        "<figure>" +
                        "<img src='images/" + myCourses[i].course.sample + "'  width='350px' height='239.167px'>" +
                        "<div class='time-box'>" +
                        "<span class='date'><span>购买课时：" + myCourses[i].classNum + "</span></span>" +
                        "<span class='time'><span>剩余课时：" + myCourses[i].numLast + "</span></span>" +
                        "</div>" +
                        "</figure>" +
                        "</div>" +
                        "</a>" +
                        "</div>";
                }
            }
            console.log(String);
            $("#myCourseDiv1").html(String);
        });

    }
}
//获取我的课程的某个信息
function getMyCourseInfo(id){
    $.post("/getOneMC",{"id":id},function (data) {
        $("#mySample").attr("src","images/"+data.course.sample);
        $("#myCName").text(data.course.cname);
        $("#myBuyTime").text(data.date);
        $("#myTotal").text(data.course.price*data.classNum);
        $("#myNum").text(data.classNum);
        $("#myLastNum").text(data.numLast);
    });
}
